<template>
    <div class="content-container">
        <Title :icon="'chat-smile-ai-fill'" :title="'询盘私信'">
            <template #time>
                <svg-icon size="14px" icon-class="refresh-line" class="mr-5px"></svg-icon>更新于今天
            </template>
        </Title>
        <div class="h-500px overflow-hidden inquiry-list">
            <el-scrollbar>
                <ul>
                    <li class="flex" v-for="item in messages" :key="item.ID">
                        <Avatar :width="40" :name="item.UserName" />
                        <div class="ml-15px inquiry-info">
                            <time>{{ formatDate(item.CreateTime) }}</time>
                            <p>{{ item.Detail }}</p>
                        </div>
                    </li>
                </ul>
            </el-scrollbar>
        </div>
    </div>
</template>

<script setup lang="ts">
import Title from '@/views/shortVideo/components/Title.vue'
import Avatar from '@/components/Avatar/index.vue'
import { getInquiryMessageApi } from '@/api/b2b/index'
import { IMessage } from '@/api/b2b/type'
import { dateFormat } from '@/utils/date'

const messages = ref<IMessage[]>([])

const formatDate = computed(() => {
    return function (data: any) {
        return dateFormat(data, 'YYYY-MM-DD HH:mm:ss')
    }
})

async function getInquiryMessage(){
    const res:ResType = await getInquiryMessageApi()
    if(res.code === 200){
        console.log(res.data)
        messages.value = res.data
    }
}

onMounted(() => {
    getInquiryMessage()
})
</script>

<style lang="scss">

</style>